<!DOCTYPE html>

<!-- 通过 xmlns:th=”http://www.thymeleaf.org“ 命令空间，将静态页面转换为动态的视图，
需要进行动态处理的元素,将使用“th:”前缀。 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
	<head>
	    <meta charset="utf-8">
		<title>新上榜的学校</title>

		<link rel="stylesheet" href="webjars/bootstrap/3.4.1/css/bootstrap.css">
		<script src="webjars/jquery/3.6.0/jquery.js"></script>
		<script src="webjars/bootstrap/3.4.1/js/bootstrap.js"></script>

		<link rel="stylesheet" href="css/eBookInfo.css">

	</head>
	<body>
	<div class="container">
			<!-- 搜索区域 -->
			<div class="search-load">
				<div>
					<button type="button" class="btn btn-success">新上榜的学校</button>
				</div>
				
				<form class="form-inline" action="" method="post">
				  <div class="form-group">
				    <input type="text" class="form-control" id="bookname" placeholder="请按校园排行名或文理分科..." name="bookKey">
				  </div>
				
		
				  <button type="button" class="btn btn-warning  book-search">搜索</button>
				</form>
			</div>
			
			<!-- 电子书状态区域 -->
			<div class="book-status">
				<div>全部</div>
				<div>上榜</div>
				<div>待审核</div>
			</div>
			<!-- 电子书列表区域 -->
			<div class="book-list">
				<table class="table table-hover">
				  <tr>
					  <th>标题</th>
					  <th>发布时间</th>
					  <th>查看</th>
					  <th>欣赏</th>
					  <th>推荐</th>
					  <th>审核</th>
					  <th>操作</th>
				  </tr>
				 

					  <tr th:each="item : ${memberInfoList[1]}">
						  <td> [[ ${item.title } ]] </td>
						  <td> [[ ${item.pushTime } ]] </td>
						  <td> [[ ${item.downCount } ]] </td>
						  <td> [[ ${item.readCount } ]] </td>
						  <td> [[ ${item.recommend }]] </td>

						  <td th:if="${item.states ==0}">未审核</td>

						  <td th:if="${item.states ==1}">已上架</td>

						  <td><a th:onclick='delNovel(${item.novelid })' href='javascript:void(0);'>删除</a></td>
					  </tr>

				</table>
			</div>
			

		</div>
	</body>
	

	<script type="text/javascript">
	
	
	 //删除
	 function delNovel(novelId){
		
			var userId= ${user.userid};
			var bookKey=$("#bookname").val();
			
			$.ajax({
					url:"delBook",
					method:"post",
					data:{
						"userId":userId,
						"bookKey":bookKey,
						"novelId":novelId
					},
					dataType:"json",
					success:(data)=>{
						
						
						var tr1=$(".book-list table tr:nth-of-type(1)");	
						
						//清空表格所有行
						$(".book-list table").empty();
						
						//添加新的行首
						$(".book-list table").append(tr1);
						
						//添加查询数据行
 						data.forEach( book => {
 							var trn=$("<tr><td>"+book.title+"</td> <td>"+book.pushTime+"</td> <td>"+book.downCount+"</td><td>"+book.readCount+"</td><td>"+book.recommend+"</td> <td>"+book.states+"</td><td><a onclick='delNovel("+book.novelid+")' href='javascript:void(0);'>删除</a></td> </tr>")
 							$(".book-list table").append(trn);
 						 })
						  
						
					},
					error: () => {
						alert("服务异常!")
					}
				})
		 
	 }
	
	
	     $(function(){
	    	 //按条件查询
 			$(".book-search").click(function(){
	    		 
 				var userId= [[${user.userId} ]];
 				var bookKey=$("#bookname").val();
 				$.ajax({
 					url:"queryebook",
 					method:"get",
 					data:{
 						"userId":userId,
 						"bookKey":bookKey
 					},
 					dataType:"json",
 					success:(data)=>{
 						
 						
 						var tr1=$(".book-list table tr:nth-of-type(1)");	
 						
 						//清空表格所有行
 						$(".book-list table").empty();
 						
 						//添加新的行首
 						$(".book-list table").append(tr1);
 						
 						//添加查询数据行
 						data.forEach( book => {
 							var trn=$("<tr><td>"+book.title+"</td> <td>"+book.pushTime+"</td> <td>"+book.downCount+"</td><td>"+book.readCount+"</td><td>"+book.recommend+"</td> <td>"+book.states+"</td><td><a onclick='delNovel("+book.novelId+")' href='javascript:void(0);'>删除</a></td> </tr>")
 							$(".book-list table").append(trn);
 						 })
 						  
 						
 					},
 					error: () => {
 						alert("服务异常!")
 					}
 				})
	    		 
	    		 
	    		 
	    	 })
 
	     })
	
	
	</script>
</html>